import { SearchBar } from 'antd-mobile';
import { useState } from 'react';
import TypeSelect from './components/TypeSelect';
import ProductList from './components/ProductList';
import style from './index.module.less';
// import axios from 'axios';
/**
 *

 */
const Home = () => {
  const [name, setName] = useState('');
  const [type, setType] = useState('all');
  // 搜索关键字
  const onSearchHandler = (value: string) => {
    setName(value);
  };
  // 清空搜索关键字
  const onClear = () => {
    setName('');
  };
  // 切换导航栏类型
  const onChangeHandler = (value: string) => {
    setType(value);
  };

  // useEffect(()=>{
  //   getlist()
  // },[])
  // const getlist=async ()=>{
  //   console.log(123);

  //   // const {data} = await axios.get('http://localhost:3000/courseList');
  //   // console.log(data);

  // }
  return (
    <div className={style.container}>
      <SearchBar className="searchBar" placeholder="搜索课程" onSearch={onSearchHandler} onClear={onClear} />
      <TypeSelect onChange={onChangeHandler} />
      <ProductList name={name} type={type} />

    </div>
  );
};

export default Home;
